import React, { Component } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import *as todoActions from '../store/actions/todo.actions'
import { getIn } from "immutable"

class Header extends Component {

  addTodos=(env)=>{
    if (env.keyCode === 13) {
      let taskName = env.target.value
    // console.log(taskName)
      if (taskName.trim().length === 0){
        alert('请输入内容')
        return
      }
      this.props.add_todo(taskName)
      env.target.value = ''
    }
  }
  render() {
    // console.log(this.props)
    return (
      <header className="header">
				<h1>todos</h1>
				<input onKeyUp={this.addTodos} className="new-todo" placeholder="还有什么任务没有完成?" />
			</header>
    )
  }
}
// 获取 store 数据
const mapStateToProps= (state) => ({
  todos: getIn(state.todoReducer, ['todos'])
})
// 处理store数据 触发dispatch
const mapDispatchToProps = (dispatch) =>({
  ...bindActionCreators(todoActions, dispatch)
})
export default connect(mapStateToProps, mapDispatchToProps)(Header)
